<template>
  <div>
    <el-carousel >
        <el-carousel-item v-for="item in 4" :key="item">
        </el-carousel-item>
      </el-carousel>
  </div>
</template>
<script>
export default {
  name: 'Home',
  data () {
    return {}
  },
  methods: {
    test: function () { // TODO待删除
      let self = this
      self.$axios.get('/api/Account/Test').then(function (data) {
        self.Message.success({
          message: '操作成功！'
        })
      })
    }
  }
}
</script>
<style>
.el-carousel__container{
  height: 480px;
}
.el-carousel__item h3 {
  color: #475669;
  font-size: 18px;
  opacity: 0.75;
  line-height: 480px;
  margin: 0;
}
.el-carousel__item:nth-child(4n+3) {
  background: url(../assets/images/carousel-item1.jpg) no-repeat ;
  background-size: 100% 100%;
}
.el-carousel__item:nth-child(4n+0) {
  background: url(../assets/images/carousel-item2.jpg) no-repeat ;
  background-size: 100% 100%;
}
.el-carousel__item:nth-child(4n+1) {
  background: url(../assets/images/carousel-item3.jpg) no-repeat ;
  background-size: 100% 100%;
}
.el-carousel__item:nth-child(4n+2) {
  background: url(../assets/images/carousel-item4.png) no-repeat ;
  background-size: 100% 100%;
}
</style>
